<template>
<view>
 <input id="mynickname" type="nickname" placeholder="请输入昵称" v-model="username" 
 @blur="handleInput" maxlength="20" />
</view>
</template>

<script lang="ts" setup>
import { ref, reactive, getCurrentInstance } from 'vue';
import TnTitle from '@/uni_modules/tuniaoui-vue3/components/title/src/title.vue'
import TnTabbar from '@/uni_modules/tuniaoui-vue3/components/tabbar/src/tabbar.vue'
import TnTabbarItem from '@/uni_modules/tuniaoui-vue3/components/tabbar/src/tabbar-item.vue'
import {  updateNickname } from '@/api/login'

const curInst = getCurrentInstance();

const props = defineProps(['message'])
const username = props.message
console.log( "===================defineProps==========================")
console.log( props )


const handleInput = () => {
	uni.createSelectorQuery().in( curInst )
	.select("#mynickname").fields({
	        properties: ["value"],
	}).exec((res) => {  
	        const nickName = res?.[0]?.value  
			console.log('获取昵称', nickName)
			username.value = nickName

			const data = {
				nickName: username.value
			}
			updateNickname(data).then(res => {
				console.log("--------handleInput-----")
				console.log(res)
				uni.showToast({
				  icon:  'none',
				  title: res.data,
					duration: 2000 // 持续时间为3000毫秒，即3秒
				})
			}).catch(error => {
				console.error("===============handleInput============" )
				console.error( error)
			})
	})
}
</script>



